import React, { useEffect } from 'react'
import { useNavigate, useParams } from 'react-router-dom'
import { Button, Card, Form, Input, message } from 'antd';
import style from '../index.module.css'
// 引入api请求
import {
  addHosSetListRequest,
  GetDataAccordingToID,
  updateHosSetFromIdRequest
} from '@/api/hospital/hospitalSet'
// 引入类型
import { addHosSetListParamsType } from '@/api/hospital/model/hospitalSetTypes'

export default function AddResult() {
  const navigate = useNavigate()
  //通过Form组件上的一个useForm方法,可以创建实例,然后在某一个Form组件上添加一个form属性,值为当前实例,那么Form表单和当前的form实例就关联起来了
  const [form] = Form.useForm()
  // 获得传过来的id值
  const { id } = useParams()
  // 当组件加载的时候,开始请求分页列表的数据
  useEffect(() => {
    if (id) {
      const getHosDetail = async () => {
        // 发送请求
        const result = await GetDataAccordingToID(id);
        form.setFieldsValue(result)
      }
      getHosDetail()
    }
  })
  // 修改和新增医院的事件
  const dataSet = async (fieldValue: addHosSetListParamsType) => {
    // 修改
    if (id) {
      await updateHosSetFromIdRequest({ ...fieldValue, id })
      navigate('/syt/hospital/hospitalSet')
      message.success('修改成功')
      return
    }
    // 新增医院的事件
    await addHosSetListRequest(fieldValue)
    message.success('添加成功')
    navigate('/syt/hospital/hospitalSet')
  }
  return (
    <div>
      <Card>
        <Form name="basic" labelCol={{ span: 2, }}
          form={form}
          onFinish={dataSet}
        >
          <Form.Item
            label="医院名称"
            name="hosname"
            rules={[
              {
                required: true,
                message: 'Please input your hosname!',
              },
            ]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            label="医院编号"
            name="hoscode"
            rules={[
              {
                required: true,
                message: 'Please input your hoscode!',
              },
            ]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            label="api基础路径"
            name="apiUrl"
            rules={[
              {
                required: true,
                message: 'Please input your apiUrl!',
              },
            ]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            label="联系人姓名"
            name="contactsName"
            rules={[
              {
                required: true,
                message: 'Please input your contactsName!',
              },
            ]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            label="联系人手机"
            name="contactsPhone"
            rules={[
              {
                required: true,
                message: 'Please input your contactsPhone!',
              },
            ]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            wrapperCol={{
              offset: 3,
            }}
          >
            <Button type="primary" htmlType="submit" className={style.mr}>
              保存
            </Button>
            <Button type="default" htmlType="button" onClick={() => { navigate(-1) }}>
              返回
            </Button>
          </Form.Item>
        </Form></Card>
    </div >
  )
}


